﻿@model XoohooViewModelItem<UserSignInInput>
<!DOCTYPE html>
<html>
<head>
    <title>@Html.SiteTitle("系统管理登录")</title>
    @Html.SiteKeywords()
    @Html.SiteDescription()
    @{Html.RenderFavIcon();}
    @{Html.RenderScriptTag("Scripts/jquery.min.js");}
    @{Html.RenderScriptTag("Scripts/jquery.unobtrusive-ajax.min.js");}
    @{Html.RenderScriptTag("Scripts/jquery.validate.min.js");}
    @{Html.RenderScriptTag("Scripts/jquery.validate.unobtrusive.min.js");}
    @{Html.RenderScriptTag("Scripts/jquery-ui.min.js");}
    @{Html.RenderCssFile("Styles/JqueryUI/jquery-ui.css");}
    @{Html.RenderCssFile("Styles/Validator/validator.css");}
    @{Html.RenderCssFile("Styles/Login.css");}
    <script language="javascript" type="text/javascript">
        if (top != self) {
            top.location = self.location;
        }
        function refreshValCode() {
            $("#valiCode").attr("src", "@Url.GetValidateCode()?time=" + new Date().toString());
        }
        function ShowAlert(title, msg) {
            $("#dialog").dialog("option", "title", title);
            $("#dialog").html("<p>" + msg + "</p>");
            $('#dialog').dialog('open');
        }
        function OnFailure(xhr, status, error) {
            alert("异步请求失败！");
        }
        function OnSuccess(data, status, xhr) {
            var result = data.Result;
            if (result) {
                refreshValCode();
                ShowAlert("登录失败", result);
            }
            else
                window.location = "@Url.Admin()";
        }
        $(document).ready(function () {
            $('#dialog').dialog({
                autoOpen: false,
                modal: true,
                width: 280,
                buttons: {
                    "确定": function () {
                        $(this).dialog("close");
                    }
                }
            });
            $("#valiCode").click(function () {
                refreshValCode();
            });
        });
    </script>
</head>
<body>
    @{
        /*
        比如TextBoxFor泛型方法，@Html.TextBoxFor(null, item => item.Username)是推导不出类型参数的
        有三种方式：
        1、Html.TextBoxFor((UserSignInInput)null, item => item.Username)
        2、Html.TextBoxFor<XoohooViewModel,UserSignInInput,string>(null, item => item.Username)
        3、UserSignInInput input = null;
           Html.TextBoxFor(input, item => item.Username)
        */
        UserSignInInput input = Model.Item;
        var valmsgContainerStyle = new { @style = "width:170px;" };
    }
    <div id="divlogin">
        <div id="divlogintop">
        </div>
        <div id="divloginmid">
            <div id="divloginmidcontent">
                @using (Ajax.BeginRouteForm("Admin.SignIn"
                                    , null
                                    , new AjaxOptions
                                    {
                                        OnSuccess = "OnSuccess"
                                        ,
                                        OnFailure = "OnFailure"
                                    }
                                    , new { @id = "LoginForm" }))
                {
                    <table border="0" cellpadding="0" cellspacing="6">
                        <tr>
                            <td width="50">
                                用 户：
                            </td>
                            <td>@Html.TextBoxFor(input, item => item.Username, new { @class = "input" })
                            </td>
                            <td>@Html.ValidationMessageFor(input, item => item.Username, "请输入用户名", valmsgContainerStyle)
                            </td>
                        </tr>
                        <tr>
                            <td>
                                密 码：
                            </td>
                            <td>@Html.PasswordFor(input, item => item.Password, new { @class = "input" })
                            </td>
                            <td>@Html.ValidationMessageFor(input, item => item.Password, "请输入密码", valmsgContainerStyle)
                            </td>
                        </tr>
                        <tr>
                            <td>
                                验证码：
                            </td>
                            <td>
                                <table border="0" cellpadding="0" cellspacing="0">
                                    <tr>
                                        <td>@Html.TextBoxFor(input, item => item.ValidateCode, new { @class = "input40" })
                                        </td>
                                        <td style="padding-left: 4px;">
                                            <img id="valiCode" style="cursor: pointer; vertical-align:middle;" src="@Url.GetValidateCode()" alt="验证码" />
                                        </td>
                                    </tr>
                                </table>
                            </td>
                            <td>@Html.ValidationMessageFor(input, item => item.ValidateCode, "请输入验证码", valmsgContainerStyle)
                            </td>
                        </tr>
                        <tr>
                            <td height="40" colspan="2" align="right">@Html.ImageButton("btnLogin", "Styles/Images/btnLogin.jpg", new { @alt = "登录系统" })
                            </td>
                            <td>
                            </td>
                        </tr>
                    </table>
                }
            </div>
        </div>
    </div>
    <div id="dialog">
    </div>
</body>
</html>
